/*
*	使用方法：导入此js文件，调用setVerifyCode()函数
* 	setVerifyCode()以对象形式传参
* 	可选参数（默认值）：
* 			isrgb: false,		设置背景颜色数据样式，默认使用十六进制格式
* 			width: 100,			设置宽度，默认100px(单位为像素)
* 			height: 30,			设置高度，默认30px(单位为像素)
* 			ele: '.verify', 	设置对应的元素，默认是 类名是verify的元素
* 			color: '#fff',		设置字体颜色，默认字体颜色为白色(字符串形式)
* 			fontWeight: 700,	设置字体厚度，默认700
* 			letterSpacing: 0,	设置字符间距，默认为0(单位为像素)
* 			letters: 4,			设置验证码位数，默认为4位
* 			radius:  6			设置圆角大小，默认是像素
* 			fontSize:  16		设置字体大小，默认是像素
*/

import $ from 'jquery';
function setVerifyCode(
	{
		isrgb:$isrgb=true,
		width:$width=100,
		height:$height=30,
		ele:$ele='.verify',
		color:$color='#fff',
		fontWeight:$fontWeight=700,
		letterSpacing:$letterSpacing=0,
		letters:$letters=4,
		radius:$radius=6,
		fontSize:$fontSize=16
	}={}){
	// console.log(obj)
	//初始化ele
	//获取元素节点
	let verify = $($ele);
	//设置元素大小、字体颜色、字体大小、字体重量、字符间距以及初始样式
	verify.css({
		width:$width,
		height:$height,
		color:$color,
		fontWeight:$fontWeight,
		letterSpacing:$letterSpacing,
		display:'inline-flex',
		alignItems:'center',
		justifyContent:'center',
		cursor:'pointer',
		userSelect:'none',
		borderRadius:$radius,
		fontSize:$fontSize
	})
	//生成大写字母的数组
	let upperLetters = [];
	for(var u=65;u<91;u++){
		upperLetters.push(String.fromCharCode(u));
	}
	//生成小写字母的数组
	let lowerLeeters = [];
	for(var l=97;l<123;l++){
		lowerLeeters.push(String.fromCharCode(l));
	}
	//生成数字的数组
	let number = [];
	for(var n=48;n<58;n++){
		lowerLeeters.push(String.fromCharCode(n));
	}
	let code = number.concat(lowerLeeters,upperLetters);
	// console.log(code)
	let setColor = ()=>{
		if($isrgb){
			let r = Math.floor(Math.random()*256);
			let g = Math.floor(Math.random()*256);
			let b = Math.floor(Math.random()*256);
			return `rgb(${r},${g},${b})`;
		}else{
			//获取十六进制数组
			let colorArray = code.slice(26,42);
			// console.log(colorArray)
			let array16 = [];
			for(let c = 0;c < 6;c++){
				let randomNum = Math.floor(Math.random()*16);
				array16.push(colorArray[randomNum]);
			}
			return `#${array16.join('')}`;
		}	
	}
	$(verify)[0].style.backgroundColor = setColor();
	let setCode = ()=>{
		let codes = [];
		for(let d = 0;d < $letters;d++){
			let randomNum = Math.floor(Math.random()*62);
			codes.push(code[randomNum]);
		}
		let context = codes.join('');
		return context;
	}
	verify.html(setCode());
	
	verify.on('click',(e)=>{
		e.target.innerHTML = '';
		let randomColor = '';
		// console.log(randomColor)
		randomColor = setColor();
		e.target.style.backgroundColor = randomColor;
		
		
		// console.log(codes)
		
		e.target.innerHTML = setCode();
	})
}
export default setVerifyCode;
